<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>广告位管理</title>
    <link rel="stylesheet" href="/static/assets/libs/layui/css/layui.css" />
    <link rel="stylesheet" href="/static/assets/module/admin.css?v=312" />
    <style>
        .layui-form-item {
            margin-bottom: 25px;
        }

        label .layui-icon {
            font-size: 14px;
            color: #666;
        }
    </style>
</head>

<body>
    <!-- 正文开始 -->
    <div class="layui-fluid">
        <div class="layui-card">
            <div class="layui-card-header">广告管理 (直接修改图片或网址即可)</div>
            <div class="layui-card-body">
                <table class="layui-table" id="tableTbBas" lay-filter="tableTbBas"></table>
                <hr>
                <div class="layui-collapse">
                    <div class="layui-colla-item">
                        <h2 class="layui-colla-title">修改说明</h2>
                        <div class="layui-colla-content layui-show">前台界面不会进行大小的限制(只适配宽度)，所以图片会已原有大小进行展示！</div>
                    </div>
                    <div class="layui-colla-item">
                        <h2 class="layui-colla-title">各广告位图片大小建议</h2>
                        <div class="layui-colla-content layui-show">
                            <p>首页横幅 &emsp;: 615px * 130px （高度可根据实际情况跳转）</p>
                            <p>分类侧边1&emsp;: 290px * 290px （高度可根据实际情况跳转）</p>
                            <p>分类横幅 &emsp;: 615px * 130px （高度可根据实际情况跳转）</p>
                            <p>试题横幅 &emsp;: 615px * 130px （高度可根据实际情况跳转）</p>

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script type="text/html" id="tableBarTbBas">
        <a class="layui-btn layui-btn-sm  layui-btn-normal" lay-event="start">启用</a>
        <a class="layui-btn layui-btn-sm layui-btn-danger" lay-event="stop">停用</a>
        <a class="layui-btn layui-btn-sm" lay-event="edit">修改</a>
        
    </script>
    <!-- js部分 -->
    <script type="text/javascript" src="/static/assets/libs/layui/layui.js"></script>
    <script type="text/javascript" src="/static/assets/js/common.js?v=312"></script>
    <script>
        layui.use(['layer', 'jquery', 'element', 'table', 'dropdown'], function () {
            var $ = layui.jquery;
            var layer = layui.layer;
            var table = layui.table;
            var element = layui.element;
            var dropdown = layui.dropdown;
            // 渲染表格
            var insTb = table.render({
                elem: '#tableTbBas',
                url: "{:url('admin/system/adlist')}",
                page: true,
                cols: [[
                    { field: 'Id', align: 'center', title: 'ID', width: 90 },
                    { field: 'description', align: 'center', title: '标识', width: 120 },
                    { field: 'img_url', align: 'center', title: '图片地址' },
                    { field: 'url', align: 'center', title: '引导链接' },
                    {
                        field: 'state', align: 'center', title: '状态', width: 90, templet: function (d) {
                            if (d.state == 1) {
                                return "<span class='text-info'>正常</span>";
                            } else {
                                return "<span class='text-danger'>禁用</span>";
                            }
                        }
                    },
                    { align: 'center', toolbar: '#tableBarTbBas', title: '操作', width: 200, minWidth: 250 }
                ]]
            });
            table.on('tool(tableTbBas)', function (obj) {
                var data = obj.data;
                var layEvent = obj.event;
                if (layEvent === 'start') {
                    $.post("{:url('admin/system/ad_index')}", { type: 'start', id: data.Id }, function (result) {
                        if (result.code == 0) {
                            layer.msg('成功', {
                                icon: 1,
                                time: 2000
                            }, function () {
                                insTb.reload();
                            });
                        } else {
                            layer.msg(data.msg);
                        }
                    });

                } else if (layEvent === 'stop') {
                    $.post("{:url('admin/system/ad_index')}", { type: 'stop', id: data.Id }, function (result) {
                        if (result.code == 0) {
                            layer.msg('成功', {
                                icon: 1,
                                time: 2000
                            }, function () {
                                insTb.reload();
                            });
                        } else {
                            layer.msg(data.msg);
                        }
                    });
                } else if (layEvent === 'edit') {
                    layer.open({
                        type: 2,
                        area: ['90%', '90%'],
                        title: '修改分类',
                        content: "{:url('admin/system/ad_edit')}?id=" + data.Id,
                        end: function () {
                            insTb.reload();
                        }
                    });
                }
                dropdown.hideAll();
            });

        });
    </script>
</body>

</html>